
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Archives | PhoneBrotherXD</title>
        <meta name="author" content="John Doe">
        <meta name="description" content="test blog">
        <meta name="keywords" content="">
        <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0">
        <link rel="icon" href="/null">
        <script src="https://cdn.staticfile.org/vue/3.2.45/vue.global.prod.min.js"></script>
        <script src="https://cdn.staticfile.org/highlight.js/11.7.0/highlight.min.js"></script>
        <link rel="stylesheet" href="https://cdn.staticfile.org/highlight.js/11.7.0/styles/github.min.css">
        <link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/6.2.1/css/all.min.css">
        
        <script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>
        
        
        
        <link rel="stylesheet" href="/css/fonts.min.css">
        <link rel="stylesheet" href="/css/particlex.css">
    <meta name="generator" content="Hexo 6.3.0"></head>
    <body>
        <div id="loading" style="height: 100vh; width: 100vw; left: 0; top: 0; position: fixed; display: flex; z-index: 2147483647; background: #fff; transition: opacity 0.3s ease-out; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; pointer-events: none">
    <div style="width: 50vmin; height: 50vmin; margin: auto; padding: 50px; border-radius: 50%; display: flex; border: solid 10px #a3ddfb">
        <div style="margin: auto; text-align: center">
            <h2>LOADING</h2>
            <p>加载过慢请开启缓存，浏览器默认开启</p>
            <img src="/images/loading.gif" style="height: 50px; border-radius: 0">
        </div>
    </div>
</div>

        <div id="layout">
            <transition name="into">
            <div id="main" v-show="showpage" style="display: -not-none">
                <nav id="menu">
    <div class="desktop-menu">
        <a class="title" href="/">
            <span>PHONEBROTHERXD</span>
        </a>
        
        <a href="/">
            <i class="fa-solid fa-house fa-fw"></i>
            <span>&ensp;Home</span>
        </a>
        
        <a href="/about">
            <i class="fa-solid fa-id-card fa-fw"></i>
            <span>&ensp;About</span>
        </a>
        
        <a href="/archives">
            <i class="fa-solid fa-box-archive fa-fw"></i>
            <span>&ensp;Archives</span>
        </a>
        
        <a href="/categories">
            <i class="fa-solid fa-bookmark fa-fw"></i>
            <span>&ensp;Categories</span>
        </a>
        
        <a href="/tags">
            <i class="fa-solid fa-tags fa-fw"></i>
            <span>&ensp;Tags</span>
        </a>
        
    </div>
    <div :class="&quot;phone-menu &quot; + menushow" id="phone-menu">
        <div class="curtain" @click="menushow = !menushow" v-show="menushow"></div>
        <div class="title" @click="menushow = !menushow">
            <i class="fa-solid fa-bars fa-fw"></i>
            <span>&emsp;PHONEBROTHERXD</span>
        </div>
        <transition name="slide">
        <div class="items" v-show="menushow">
            
            <a href="/">
                <div class="item">
                    <div style="min-width: 20px; max-width: 50px; width: 10%">
                        <i class="fa-solid fa-house fa-fw"></i>
                    </div>
                    <div style="min-width: 100px; max-width: 150%; width: 20%">Home</div>
                </div>
            </a>
            
            <a href="/about">
                <div class="item">
                    <div style="min-width: 20px; max-width: 50px; width: 10%">
                        <i class="fa-solid fa-id-card fa-fw"></i>
                    </div>
                    <div style="min-width: 100px; max-width: 150%; width: 20%">About</div>
                </div>
            </a>
            
            <a href="/archives">
                <div class="item">
                    <div style="min-width: 20px; max-width: 50px; width: 10%">
                        <i class="fa-solid fa-box-archive fa-fw"></i>
                    </div>
                    <div style="min-width: 100px; max-width: 150%; width: 20%">Archives</div>
                </div>
            </a>
            
            <a href="/categories">
                <div class="item">
                    <div style="min-width: 20px; max-width: 50px; width: 10%">
                        <i class="fa-solid fa-bookmark fa-fw"></i>
                    </div>
                    <div style="min-width: 100px; max-width: 150%; width: 20%">Categories</div>
                </div>
            </a>
            
            <a href="/tags">
                <div class="item">
                    <div style="min-width: 20px; max-width: 50px; width: 10%">
                        <i class="fa-solid fa-tags fa-fw"></i>
                    </div>
                    <div style="min-width: 100px; max-width: 150%; width: 20%">Tags</div>
                </div>
            </a>
            
        </div>
        </transition>
    </div>
</nav>

                
<div id="archives">
    
    
    <div class="timeline" style="z-index: 2" data-title="第一篇文章">
        <div class="timeline-tail"></div>
        <div class="timeline-content">
            <div class="item-time">2023/2/27</div>
            <a href="/2023/02/27/%E7%AC%AC%E4%B8%80%E7%AF%87%E6%96%87%E7%AB%A0/">
                <h3>第一篇文章</h3>
            </a>
            <div class="info">
                
                
            </div>
        </div>
    </div>
    
    <div class="timeline" style="z-index: 1" data-title="helloworld">
        <div class="timeline-tail"></div>
        <div class="timeline-content">
            <div class="item-time">2023/2/27</div>
            <a href="/2023/02/27/hello-world/">
                <h3>Hello World</h3>
            </a>
            <div class="info">
                
                
            </div>
        </div>
    </div>
    
</div>

                <footer id="footer">
    <div class="footer-wrap">
        <div>
            &copy;
            2022 - 2023 PhoneBrotherXD
            <span class="footer-icon">
                <i class="fa-solid fa-font-awesome fa-fw"></i>
            </span>
            &commat;John Doe
        </div>
        <div>Based on the <a target="_blank" rel="noopener" href="https://hexo.io">Hexo Engine</a> &amp; <a target="_blank" rel="noopener" href="https://github.com/argvchs/hexo-theme-particlex">ParticleX Theme</a></div>
        
    </div>
</footer>

            </div>
            </transition>
            <div id="showimg">
                <img id="showimg-content">
            </div>
        </div>
        <script src="/js/functions.js"></script>
<script src="/js/particlex.js"></script>


    </body>
</html>
